<template>
	<!-- 车辆编辑 -->
	<div>
		<div class="edit-top">
			编辑信息
			<i class="el-icon-close" @click='cancel'></i>
		</div>
		<div class="edit-content">
			<div class="edit-title">车辆信息</div>
			<div class="edit-item">
				<label>车牌号</label><input v-model="info.licensePlateNumber" type="text" />
			</div>
			<div class="edit-item">
				<label>车牌类型</label>
				<el-radio v-for='item in dict.licensePlateType' :key='item.value' v-model="info.licensePlateType" :label="item.value">{{item.type}}</el-radio>
			</div>
			<div class="edit-item">
				<label>车架号</label><input v-model="info.vin" readonly="readonly" type="text" />
			</div>
			
			<div class="edit-item">
				<label>车辆型号</label><input v-model="info.model" type="text" />
			</div>
			<div class="edit-item">
				<label>电池包号</label><input v-model="info.initBatteryCode" type="text" />
			</div>
			<div class="edit-item">
				<label>行驶证号</label><input v-model="info.drivingLicenseNum" type="text" />
			</div>
			<div class="edit-item">
				<label>车主(产权人)</label>
				<el-select v-model="client" filterable placeholder="请选择">
					<el-option v-for="(item,index) in client_list" :key="item.id" :label="item.chineseName" :value="index">
					</el-option>
				</el-select>
			</div>
			<div class="edit-item">
				<label>证件类型</label>
				<el-radio v-for='item in client_dict.identityType' disabled :key='item.value' v-model="info.ownerType" :label="item.value">{{item.type}}</el-radio>
			</div>
			<div class="edit-item">
				<label>证件号</label><input readonly="readonly" v-model="info.ownerIdcard" type="text" />
			</div>
			<div class="edit-item">
				<label>车主手机号</label><input readonly="readonly" v-model="info.ownerPhoneNum" type="text" />
			</div>
			<div class="edit-item">
				<label>使用性质</label>
				<el-radio v-for='item in dict.property' :key='item.value' v-model="info.property" :label="item.value">{{item.type}}</el-radio>
			</div>
		</div>
		<div class="edit-bottom">
			<span @click='cancel'>取消</span>
			<el-button @click='save' type="primary">保存</el-button>
		</div>
	</div>
</template>

<script>
	let _this;
	export default {
		props:['id'],
		data() {
			return {
				client_list: '',
				client: '',
				dict: '',
				client_dict:'',
				info: {
					vin: '',
					vehicleType: 0,
					status: 0,
					model: '',
					manufacturer: '',
					initBatteryCode: '',
					engineCode: '',
					licensePlateType: "1",
					licensePlateNumber: '',
					drivingLicenseNum: '',
					ownerId: '',
					ownerName:'',
					ownerIdcard: '',
					ownerType: '',
					ownerPhoneNum: '',
				}

			}
		},
		created() {
			_this = this;
		},
		watch: {
			client() {
				console.log(_this.client_list[_this.client]);
				_this.info.ownerId = _this.client_list[_this.client].id;
				_this.info.ownerName = _this.client_list[_this.client].chineseName;
				_this.info.ownerType = _this.client_list[_this.client].identityType + '';
				_this.info.ownerIdcard = _this.client_list[_this.client].identityNum;
				_this.info.ownerPhoneNum = _this.client_list[_this.client].mobileNum;
			}
		},
		mounted() {
			this.get_dict();
			this.get_client_dict();
			this.get_client();
			
		},
		methods: {
			get_info(){
				this.$axios.get(this.$global.serverIp + 'vehicle/vehicle/detail/' + this.id)
					.then(function(res) {
						if (res != ''){
							_this.info.licensePlateNumber = res.data.licensePlateNumber;
							_this.info.licensePlateType = res.data.licensePlateType;
							_this.info.vin = res.data.vin;
							_this.info.initBatteryCode = res.data.initBatteryCode;
							_this.info.property = res.data.property;
							_this.info.id = res.data.id;
							_this.info.model = res.data.model;
							_this.info.drivingLicenseNum = res.data.drivingLicenseNum;
							for(var i=0;i<_this.client_list.length;i++){
								if(res.data.ownerId == _this.client_list[i].id){
									_this.client = i;
								}
							}
						}
					})
			},
			get_client() {
				this.$axios.post(this.$global.serverIp + 'admin/sysClient/findPage', {
						"limit": "10000",
						"page": "1"
					})
					.then(function(res) {
						if (res != '') {
							_this.client_list = res.data.list;
							_this.get_info();
						}
					})
			},
			get_client_dict(){
				this.$axios.get(this.$global.serverIp + 'admin/dict/findDict?keyword=sysClient')
					.then(function(res) {
						if (res != '')
							_this.client_dict = res.data;
					})
			},
			get_dict() {
				this.$axios.get(this.$global.serverIp + 'admin/dict/findDict?keyword=vehicle')
					.then(function(res) {
						if (res != '')
							_this.dict = res.data;
					})
			},
			save() {
				if (this.info.licensePlateNumber == "") {
					this.$popup.open('车牌号不能为空');
					return;
				}
				if (this.info.vin == "") {
					this.$popup.open('车架号不能为空');
					return;
				}
				if (this.info.model == "") {
					this.$popup.open('型号不能为空');
					return;
				}
				if (this.info.initBatteryCode == "") {
					this.$popup.open('电池包号不能为空');
					return;
				}
				if (this.info.drivingLicenseNum == "") {
					this.$popup.open('行驶证号不能为空');
					return;
				}
				if (this.info.ownerId == "") {
					this.$popup.open('车主信息不能为空');
					return;
				}

				this.$axios.post(this.$global.serverIp + 'vehicle/vehicle/edit', _this.info)
					.then(function(res) {
						if (res != '') {
							_this.success('编辑成功');
						}
					})

			},
			success(content) {
				this.$alert(content, '提示', {
					confirmButtonText: '确定',
					callback: action => {
						_this.$emit("saveEdit", 2);
					}
				});
			},
			cancel() {
				this.$emit("saveEdit", 1);
			}
		}
	}
	import '@/assets/css/edit.css'
</script>
